import React, { Component } from "react";
import { View, Text, ScrollView } from "react-native";
import NavBarConfig from "../modules/NavBar";
import moment from "moment";
import { MESSAGE } from "../../config/Api";
import http from "../../util/http";
import noticeStyles from "../../style/pages/notice";

class MessageDetail extends Component {
  static navigationOptions = ({ navigation }) =>
    NavBarConfig(
      {
        headerTitle: "站內信詳情",
        headerRight: []
      },
      navigation
    );
  state = {
    notice: {}
  };

  async getNotice() {
    const data = await http.get(
      `${MESSAGE}/${this.props.navigation.state.params.id}`
    );

    if (data) {
      this.setState({
        notice: data.data
      });
    }
  }

  componentWillMount() {
    this.getNotice();
  }
  
  render() {
    const { notice } = this.state;
    return (
      <ScrollView>
        <View style={noticeStyles.bgtMsgContent}>
          <View style={noticeStyles.MassgeTitleInfo}>
            <Text style={noticeStyles.infoH4}>{notice.title}</Text>
            {/* <Text style={noticeStyles.infoSpan}>
              {moment(notice.publishtime).format("YYYY-MM-DD HH:mm:ss")}
            </Text> */}
          </View>
          <Text style={noticeStyles.messageContent}>{notice.content}</Text>
        </View>
      </ScrollView>
    );
  }
}

export default MessageDetail;
